
@import "./mixin/mixin";

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
html,body {
  display: flex;
  display: -webkit-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
  overflow: hidden;
}
:focus-visible,:focus{
  outline: none !important;
}

button, input, select, textarea {
  border: none;
  outline: none;
  box-shadow: none;
}
li {
  list-style: none;
}

#tarot{
  display: flex;
  display: -webkit-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
}

/**
 * 系统消息提示背景颜色设定
 */
@for $i from 1 through length($tarot-message-color) {
  $item: nth($tarot-message-color, $i);
  .tarot-#{map_get($item, name)} {
    background-color: map_get($item, color);
  }
}

main {
  display: flex;
  display: -webkit-flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  height: calc(100% - 40px);
  margin-top: 40px;
  overflow: hidden;
  aside {
    width: 185px;
    background: $tarot-system-bg-color;
    transition: width 300ms ease-in-out;
  }
  .aside-fold {
    width: 64px;
  }
  article {
    padding: 5px;
    flex: 1;
    height: 100%;
    overflow: auto;
    overflow-x: hidden;
    /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
    &::-webkit-scrollbar{
      width: 6px;
      height: 6px;
      background-color: $tarot-system-font-color;
    }

    /*定义滚动条轨道 内阴影+圆角*/
    &::-webkit-scrollbar-track{
      -webkit-box-shadow: inset 0 0 6px rgba($tarot-system-bg-color, 0.7);
      //border-radius: 10px;
      background-color: $tarot-system-font-color;
    }

    /*定义滑块 内阴影+圆角*/
    &::-webkit-scrollbar-thumb{
      border-radius: 10px;
      -webkit-box-shadow: inset 0 0 8px rgba($tarot-system-bg-color, 1);
      background-color: $tarot-system-font-color;
    }
  }
}
